.box{
    overflow: hidden;
    .el-card{
        position: relative;
        .searchSort{
            display: flex;
            position: absolute;
            left: 39%;
            top: 2%;
            width: 600px;
            justify-content: space-between;
            .iconStyle{
                display: inline-block;
                i{
                    display: block;
                    cursor: pointer;
                }
            }
        }
    }
    .list{
        width: 100%;
        margin-top: 124px;
        display: flex;
        // justify-content:space-between;
        flex-wrap: wrap;
        .elCol{ // 卡片
            background-color: #fff;
            height: 208px;
            width: 24%;
            padding: 22px;
            position: relative;
            margin-top: 15px;
            // margin-right: 10px;
            .firmTitle{
                // font-size: 20px;
                font-weight: 600;
                color: #2B333E;
                font-size: 1.3vw;
                .stateDot{
                    display: inline-block;
                    width: 11px;
                    height: 11px;
                    border-radius: 10px;
                    margin-left: 5px;
                }
            }
            .primaryNum{
                // font-size: 14px;
                margin: 16px 0;
                color: #2B333E;
                font-size: 0.8vw;
            }
            .numList{
                height: 50px;
                display: flex;
                justify-content: space-between;
                align-items: center;
                margin: 24px 0;
                .startNname{
                    // font-size: 14px;
                    color: #B6B6B6;
                    font-size: 0.8vw;
                    .startNum{
                        // font-size: 20px;
                        font-weight: 600;
                        margin-top: 15px;
                        color: #2B333E;
                        font-size: 1.2vw;
                    }
                }
                .line{
                    height: 40px;
                    width: 1px;
                    color: #ccc;
                    display: block;
                    border: 1px solid #ccc;
                }
            }
            .loginTime{
                // font-size: 14px;
                color:#B6B6B6;
                font-size: 0.7vw;
            }
            .toDetail{
                position: absolute;
                color: #5496F2;
                // font-size: 14px;
                right: 22px;
                bottom: 19px;
                cursor: pointer;
                font-size: 0.7vw;
            }
        }    
        .elCol:not(:nth-child(4n)) { 
            margin-right: calc(4% / 3);
        }
    }

    
}


.bg-purple-dark {
    // min-height: 80px;
    background-color: #fff;
    margin-bottom: 10px;
    position: relative;
    min-height: 130px;
    .cardInformation {
      height: 40px;
      display: flex;
      align-items: center;
      padding-top: 30px;
      padding-left: 30px;
      position: relative;
      .blueIcon {
        width: 6px;
        height: 30px;
        background-color: #5496f2;
      }
      .dataName {
        font-size: 16px;
        margin-left: 10px;
        color: #2b333e;
        font-weight: 600;
      }
      .recentlyDay {
        font-size: 14px;
        color: #b6b6b6;
        margin-left: 10px;
      }
      .titleData{
          margin-left: 10px;
      }
      .tabChartName {
        position: absolute;
        right: 5%;
        z-index: 1;
      }
    }
    .browse{
        font-size: 16px;
        margin-left: 10px;
        color: #2b333e;
        font-weight: 600;
        padding: 20px 0 0 18px;
    }
    .card-filters{
        display: flex;
        align-items: center;
        .el-menu-demo{ // 导航
            width: 166px;
            height: 30px;
            margin:17px 0 0 28px;
            .el-menu-item{
                height: 30px;
                line-height: 35px;
            }
            .el-menu--horizontal>.el-menu-item{
                line-height: 35px;
            }
            .el-menu .el-menu-item.is-active{
                height: 50px;
            }
        }
        .time-filter {
            display: flex;
            align-items: center;
            width: 30vw;
            margin-left: 4vw;
            font-size: 1vw;
            .intervalTime{
                width:22vw;
                .intervalTime>>>.el-range-input{
                    font-size: 0.8vw;
                }
            }
          }
    }
    
    .el-timeline{ // 时间线
        width: 96%;
        margin-top: 20px;
        overflow-y: scroll;
        height: 460px;
    }
    .el-timeline::-webkit-scrollbar{/*滚动条整体部分，其中的属性有width,height,background,border等（就和一个块级元素一样）（位置1）*/
        width:10px;
    }
    .el-timeline::-webkit-scrollbar-thumb{/*滚动条里面可以拖动的那部分（位置5）*/
        height: 118px;
        background:#DFDFDF;
        border-radius:4px;
    }
    .timeline >>> .el-timeline-item__wrapper{ // 时间线
        position: relative;
        // padding: 6px;
        padding: 15px 0 0 14px;
        background-color: #F7F8FA;
        height: 64px;
        margin-left: 15px;
        font-weight: 14px;
    }
    .cardUl {
        display: flex;
        margin: 20px 10px 0 20px;
        width: 77vw;
        .cardList {
          height: 114px;
          background-color: #f7f8fa;
          margin-left: 10px;
          margin-bottom: 10px;
          width: 240px;
          .cardTxt {
            color: #6b6b6b;
            font-size:0.9vw;
            margin: 20px 0 0 24px;
            display: inline-block;
          }
          .cardNum {
            margin: 10px 0 0 24px;
            font-size: 2vw;
            color: #2b333e;
          }
        }
    }
    .ve-chart{
        margin-top: 20px;
    }
}
.r-card-header{ // 搜索框
    margin: 34px 0 0 32px;
    display: inline-block;
}
.searchSort{ // 排序键
    display: flex;
    float: right;
    margin: 37px 30px 0 0;
    width: 340px;
    justify-content: space-between;
    .searchBox{
        display: flex;
        .searchName{
            font-size: 14px;
            margin: 3px 5px 0 0;
        }
        .iconStyle{
            .el-icon-caret-top,.el-icon-caret-bottom{
                display: block;
                height: 10px;
                line-height: 10px;
                margin: 0;
                cursor: pointer;
                color: #ccc;
            }
        }
    }
}
